<#include "../../layout.ftl">
<@title>
    <title>网关历史数据</title>
</@title>
<@css>

</@css>
<@layout>
    <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="searchForm">
                    <div class="select-list">
                        <ul>
                            <li>
                                网关编号：<input type="text" id="gatewayMac" value="" />
                            </li>
                            <li>
                                日期：<input type="text" id="queryStartDay" readonly value="${stime}" onclick="WdatePicker({isShowClear:false,dateFmt:'yyyy-MM-dd'})" />
                            </li>
                            <li>
                                日期：<input type="text" id="queryEndDay" readonly value="${etime}" onclick="WdatePicker({isShowClear:false,dateFmt:'yyyy-MM-dd'})" />
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="query();"><i class="fa fa-search"></i>&nbsp;搜索</a>

                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="btn-group-sm" id="toolbar" role="group">

            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="dataTable"></table>
            </div>
        </div>
    </div>
</@layout>

<@js>

    <script layout:fragment="script">
        let $table;
        let lastPageUploadTime;
        $(function () {
            loadData();
        });


        function loadData() {
            let options = {
                url: '/iot/gateway/getHistoryPageList',
                pageNumber: 1,                      // 初始化加载第一页，默认第一页,并记录
                pageSize: 10,                       // 每页的记录行数（*）
                pageList: "10, 25, 50, 100",        // 可供选择的每页的行数（*）
                queryParams: function (params) {
                    let p = {
                        pageNumber: params.pageNumber,
                        pageSize: params.pageSize,
                        queryStartDay: $('#queryStartDay').val(),
                        queryEndDay: $('#queryEndDay').val(),
                        gatewayId: $('#gatewayMac').val(),
                        lastPageUploadTime: lastPageUploadTime,
                        //total: total
                    }
                    return p;
                },
                columns: [
                    {
                        field: 'externalPower', title: '外部电源', align: 'center', formatter: function (v) {
                            if (v == 1) {
                                return '<span class="label label-primary">是</span>';
                            }
                            return '';
                        }
                    },
                    {
                        field: 'voltage', title: '电压(mV)', align: 'center'
                    },
                    {
                        field: 'net4g', title: '4G网络状态', align: 'center'
                    },
                    {
                        field: 'signal4g', title: '4G信号强度', align: 'center'
                    },
                    { field: 'upload_time', title: '上传时间', align: 'center' }
                ], onLoadSuccess: function (data) {

                    lastPageUploadTime = data.LatestUploadTime;
                    //total = data.total;

                }
            };

            $table = $('#dataTable').easyTable(options);
        }
        function query() {
            //total = 0;
            lastPageUploadTime = '';
            $table.easyTable("search");
        }

    </script>
</@js>
